Rendering multiple render passes or textures

You can use a Blit Render Pass to blit multiple Composition Target Render Pass render passes or textures to the screen using a specific material. By default a Blit Render Pass blits only one Composition Target Render Pass or texture.

For example, you can blit multiple render passes to the screen using a specific material to create post-processing effects, such as bloom. See Tutorial: Create a bloom effect.

To render multiple render passes or textures:

  1. Modify the DefaultBlit material type to support blitting multiple textures:
    1. In the Library > Materials and Textures > Material Types > DefaultBlit double-click the Fragment Shader to open it in the Shader Source Editor.
      TIP

      If your project does not contain the DefaultBlit material type, in the Library > Materials and Textures press Alt and right-click Material Types, and select DefaultBlit.

    2. In the Shader Source Editor add the uniforms that you want the Blit Render Pass to use, modify the shader to use them, and click Save.
      For example, to make the shader mix the Texture0 and Texture1 properties using the custom property Weight to weigh between them, replace the contents of the shader file with
      uniform sampler2D Texture0;
      uniform sampler2D Texture1;
      uniform mediump float Weight;
      
      varying mediump vec2 vTexCoord;
      
      void main()
      {
          precision lowp float;
      
          gl_FragColor = mix(texture2D(Texture0, vTexCoord), texture2D(Texture1, vTexCoord), Weight);
      }
    3. In the Library > Materials and Textures > Material Types select the DefaultBlit material type and in the Properties click Sync with Uniforms to create and add the properties you defined in the fragment shader to this material type and the materials that use it.
    4. In the Create Property Type window click Yes to create the custom property type Weight that you use to weigh between the Texture0 and Texture1 properties, in the Property Type Editor set the Default Value property to 0,5, and click Save.
  2. In the Library > Materials and Textures > Materials select the DefaultBlitMaterial material, which uses the DefaultBlit material type that you modified to support multiple textures, and in the Properties set the Blend Mode property to Alpha: Premultiplied.
    You set Kanzi to blend the textures that it blits on the screen using this material.
  3. In the Library press Alt and right-click Rendering, and select Compose and Blit Pass.
    Compose and Blit Pass template contains the render pass structure that enables you to blit to the screen Composition Target Render Pass render passes or textures using a specific material. The template contains these render passes:
  4. In the Project select the Scene node whose content you want to render to a composition target and in the Properties set the Render Pass property to the Compose and Blit Pass.
    Kanzi renders the content of that Scene node to a composition target and uses the Compose and Blit Pass > Blit Render Pass to draw the content.
  5. In the Library > Rendering > Render Passes select the Compose and Blit Pass > Blit Render Pass and in the Properties add and set:


See also

Tutorial: Create a bloom effect

Rendering

Using material types

Shaders

Textures